<template>
    <div class="tes">
      <center>
      <el-button type="success" @click="gou">购买商品</el-button>
      <el-button type="success" @click="dings">查看订单</el-button>
      <el-button type="success" @click="xiaos">消费记录</el-button>
        <el-form :model="form" style="width: 150px">
          <h1>个人信息</h1>
          <el-form-item label="姓名："   >
            {{form.cname}}
          </el-form-item>
          <el-form-item label="手机号："   >
            {{form.phone}}
          </el-form-item>
          <el-form-item label="性别："  >
            {{form.gender}}
          </el-form-item>
          <el-form-item label="年龄："  >
            {{form.age}}
          </el-form-item>
          <el-form-item label="钱包余额："  >
            {{form.bmoney}}
          </el-form-item>
        </el-form>

        <div slot="footer" class="dialog-footer">
          <el-button type="danger" @click="chong">充值</el-button>
        </div>
      </center>


      <el-dialog title="会员充值" :visible.sync="dialogFormVisible">
        <el-form :model="forms">
          <el-form-item label="充值金额" :label-width="formLabelWidth">
            <el-input v-model="forms.money" type="number" autocomplete="off" style="width: 200px"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible = false">取消</el-button>
          <el-button type="primary" @click="dialogFor" :disabled="forms.money<=0">充值</el-button>
        </div>
      </el-dialog>
    </div>
</template>

<script>
    export default {
        name: "Tes",
      data(){
          return{
            form:{
              id:"",
            },
            forms:{
              money:"",
              name:"",
            },
            name:"",
            dialogFormVisible:false,
            formLabelWidth:"200px",
          }
      },
      methods:{
        xiaos(){
          this.$router.push("/xiao")
        },
        dings(){
          this.$router.push("/ding")
        },
        gou(){
this.$router.push({name:"gou",query:{id:this.form.id,bmoney:this.form.bmoney}})
        },
initData(){
  this.axios.get(`http://localhost:9001/api/member/findAll?name=${this.$route.query.name}`).then(res=>{
    this.form=res.data;
  })
},
        chong(){
          this.forms.money={};
          this.dialogFormVisible=true;
        },
        dialogFor(){

  this.forms.name=this.$route.query.name;
          this.axios.post(`http://localhost:9001/api/member/update`,this.forms).then(res=>{
           if (res.data.code==200){
             this.initData();
             this.dialogFormVisible=false;
             this.$message.success("充值成功");
           } else {
             this.$message.success("充值失败");
           }
          })
        }
      },
      created(){
          const token = localStorage.getItem("token");
          console.log(token);
          this.axios.defaults.headers.common['token']=token;
          this.name=this.$route.query.name;

          this.initData();
      }
    }
</script>

<style scoped>

</style>
